<!--
  智慧小区管理系统 - 权限按钮组件（仅支持菜单权限）
  @author Wu.Liang
  @date 2024-01-01
  @updated 2025-07-03 - 权限简化，仅保留菜单权限判断
-->
<template>
  <el-button
    v-if="hasMenuPermission"
    v-bind="$attrs"
    :type="buttonType"
    :size="props.size"
    :disabled="disabled || loading"
    :loading="loading"
    @click="handleClick"
  >
    <el-icon v-if="icon" class="mr-1">
      <component :is="icon" />
    </el-icon>
    <slot />
  </el-button>
</template>

<script setup lang="ts">
import { computed } from 'vue'
import { ElMessage } from 'element-plus'
import { useUserStore } from '@/store/user'
import { usePermissionStore } from '@/store/permission'
import { ROLE_CODES } from '@/constants/roles'
import { isSuperAdmin, hasPermission } from '@/utils/permission'
import { showWarning } from '@/utils/message'

// Props
interface Props {
  permission: string // 仅支持菜单权限编码，如 user:menu
  message?: string
  buttonType?: 'primary' | 'success' | 'warning' | 'danger' | 'info'
  size?: '' | 'large' | 'default' | 'small' | undefined
  disabled?: boolean
  loading?: boolean
  icon?: any // 兼容el-icon类型
}

const rawProps = defineProps<Props>()
const props = {
  permission: rawProps.permission ?? '',
  message: rawProps.message ?? '权限不足',
  buttonType: rawProps.buttonType ?? 'primary',
  size: rawProps.size,
  disabled: rawProps.disabled ?? false,
  loading: rawProps.loading ?? false,
  icon: rawProps.icon ?? ''
}

// Emits
const emit = defineEmits<{
  click: [event: MouseEvent]
}>()

// Store
const userStore = useUserStore()
const permissionStore = usePermissionStore()

// 检查权限
const checkPermission = () => {
  // 使用统一的权限判断方法
  if (isSuperAdmin()) return true
  return hasPermission(props.permission)
}

// 仅菜单权限判断
const hasMenuPermission = computed(() => {
  if (!props.permission) return true
  return checkPermission()
})

// 事件处理
const handleClick = (event: MouseEvent) => {
  if (!hasMenuPermission.value) {
    showWarning(props.message)
    return
  }
  emit('click', event)
}
</script>

<style scoped>
.mr-1 {
  margin-right: 4px;
}
</style> 